import { createRouter, createWebHashHistory } from 'vue-router'
import NProgress from 'nprogress'
// 不引入css不会显示进度条 草草草
import 'nprogress/nprogress.css'

import store from '@/store'

// 通用
const global = [
  { path: '/', redirect: { name: 'page1' }, meta: { title_cn: '重定向', title_en: 'Redirect' } },
  { path: '/login', name: 'login', component: () => import('@/components/global/login.vue'), meta: { title_cn: '登录', title_en: 'Login' } },
  { path: '/404', name: '404', component: () => import('@/components/global/404.vue'), meta: { title_cn: '404', title_en: '404' } },
  {
    path: '/:pathMatch(.*)',
    redirect: '/404'
  },
]

//
const main = [
  //主页面
  {
    path: '/home',
    name: 'home',
    component: () => import("@/components/layout/index.vue"),
    meta: { title_cn: '整体布局', title_en: 'LayOut' },
    children: [
      {
        path: '/aaa',
        name: 'aaa',
        component: () => import('@/views/demo1/index.vue'),
        meta: {
          id: 'pr2',
          title_cn: 'aaa',
          title_en: '',
          isTab: true,
          type: 1,
          isDynamic: false,
          keepAlive: true,
          multiple: false
        }
      },
      {
        path: '/page1',
        name: 'page1',
        component: () => import('@/views/page1.vue'),
        meta: {
          id: 'page1',
          title_cn: 'page1',
          title_en: '',
          isTab: true,
          type: 1,
          isDynamic: false,
          keepAlive: true,
          multiple: false
        },
      },
      {
        path: '/demo',
        name: 'demo',
        component: () => import('@/views/demo/index.vue'),
        meta: {
          id: 'pr3',
          title_cn: 'Demo',
          title_en: '',
          isTab: true,
          type: 1,
          isDynamic: false,
          keepAlive: true,
          multiple: false
        },
      },
      {
        path: '/page2',
        name: 'page2',
        component: () => import('@/views/page2.vue'),
        meta: {
          id: 'page2',
          title_cn: 'page2',
          title_en: '',
          isTab: true,
          type: 1,
          isDynamic: false,
          keepAlive: true,
          multiple: false
        },
      },
      {
        path: '/page4',
        name: 'page4',
        component: () => import('@/views/page4.vue'),
        meta: {
          id: 'page4',
          title_cn: 'page4',
          title_en: '',
          isTab: true,
          type: 1,
          isDynamic: false,
          keepAlive: true,
          multiple: false
        }
      },
      {
        path: '/page3',
        name: 'page3',
        component: () => import('@/views/page3.vue'),
        meta: {
          id: 'page3',
          title_cn: 'page3',
          title_en: '',
          isTab: true,
          type: 1,
          isDynamic: false,
          keepAlive: true,
          multiple: false
        }
      }
    ]
  }
]


const routes = global.concat(main)

const router = createRouter({
  history: createWebHashHistory(process.env.BASE_URL),
  routes
})

router.beforeEach((to, from, next) => {
  document.title = to.meta.title_cn || document.title;
  NProgress.done().start()
  if(to.path=='/404'){
    // 处理history路由刷新的问题 缓存下来
    sessionStorage.setItem(
      "activeSession",
      JSON.stringify(store.state.menu.activeTab)
    );
    sessionStorage.setItem(
      "collapse",
      JSON.stringify(store.state.menu.isOpen)
    );
    sessionStorage.setItem(
      "tabList",
      JSON.stringify(store.state.menu.tabList)
    );
  }else{
    // 解决 url栏输入回车跳转问题
    sessionStorage.setItem(
      "activeSession",
      JSON.stringify(to.path)
    );
  }
  next()
})

router.afterEach((to, from) => {
  NProgress.done()
})

export default router
